import { Fragment } from 'react';
import { Button, Tooltip } from 'antd';

import { DictionaryRenderFun } from '../common/Format';
import { PlanManageAPI } from '../common/type';

import { removeDateHmsStr, tooltipLength } from '@/utils';
import pageStyles from '@/common/pageLayout.less';
import { EyeOutlined } from '@ant-design/icons';
import MyIcon from '@/components/MyIcon';
import { ColumnsRenderFun, formatDecimal } from '../../Acommon';

/**
 * 操作按钮
 * */
const Operation = (curRes: Record<string, any>, operateFuns: PlanManageAPI.IOperateAPI, record: Record<string, any>) => {
  /**按钮集合数组*/
  let operationArray: any = [];

  /**按钮样式*/
  let txtStyle: React.CSSProperties = {
    fontSize: '.75rem',
  };

  const view = curRes?.['/purchasePlanController/getPlanDetails'] && (
    <Fragment key={record?.id + 'EyeOutlined'}>
      <Button type={'link'} size={'small'} icon={<EyeOutlined />} onClick={() => operateFuns?.onView(record)}>
        查看
      </Button>
    </Fragment>
  );

  /**一个按钮都没有时展示*/
  const Disable = (
    <Fragment key={record?.id + '--Disable'}>
      <Button style={{ ...txtStyle, color: '#000' }} type={'link'} size={'small'} disabled>
        --
      </Button>
    </Fragment>
  );

  operationArray = [view];
  operationArray = operationArray?.filter((itemBtn: any) => itemBtn);
  return operationArray && operationArray?.length > 0 ? operationArray : [Disable];
};

/**
 * 管理页表格配置
 * */
export const ManageTableSwitch = (curRes: Record<string, any>, operateFuns: PlanManageAPI.IOperateAPI) => {
  /**
   * 排序方法
   * */
  const getSorter = (prev: Record<string, any>, next: Record<string, any>): number => (prev > next ? 1 : -1);
  return [
    {
      title: '计划类别',
      dataIndex: 'supplyWay',
      key: 'supplyWay',
      visible: true,
      fixed: 'left',
      sorter: (a: any, b: any) => getSorter(a?.supplyWay, b?.supplyWay),
      width: 160,
      render: (text: string) => {
        return (
          <Tooltip>
            <span className={pageStyles['over-flow-hidden']}>{text == '0' ? '月度计划' : text == '1' ? '零星采购' : text == '2' ? '实验平台' : '--'}</span>
          </Tooltip>
        );
      },
    },
    {
      title: '承办部门/团队',
      dataIndex: 'applyDepartmentName',
      key: 'applyDepartmentName',
      width: 170,
      visible: true,
      fixed: 'left',
      sorter: (a: any, b: any) => getSorter(a?.applyDepartmentID, b?.applyDepartmentID),
      render: (text: string) => ColumnsRenderFun({ text, isTooltip: true }),
    },
    {
      title: '计划名称',
      dataIndex: 'planName',
      key: 'planName',
      visible: true,
      width: 280,
      fixed: 'left',
      sorter: (a: any, b: any) => getSorter(a?.planName, b?.planName),
      render: (text: string, record: Record<string, any>) => {
        return (
          <a
            onClick={() => {
              if (curRes?.['/purchasePlanController/getPlanDetails']) {
                operateFuns?.onView(record);
              }
            }}
            style={{ color: '100%' }}
          >
            <Tooltip title={tooltipLength(text, 50)}>
              <span className={pageStyles['over-flow-hidden']}>{text ? text : '--'}</span>
            </Tooltip>
          </a>
        );
      },
    },
    {
      title: '预估总价(元)',
      dataIndex: 'expectSum',
      key: 'expectSum',
      visible: true,
      sorter: (a: any, b: any) => getSorter(a?.expectSum, b?.expectSum),
      width: 150,
      render: (text: number) => <span>{formatDecimal(text)}</span>,
    },
    {
      title: '计划状态',
      dataIndex: 'state',
      key: 'state',
      sorter: (a: any, b: any) => getSorter(a?.state, b?.state),
      visible: true,
      width: 140,
      render: (text: string) => {
        return (
          <Tooltip>
            <div>
              {text == '0' ? (
                <>
                  <MyIcon type="icon-dian" style={{ color: '#1e9392' }} />
                  &nbsp;
                  <span>待执行</span>
                </>
              ) : text == '1' ? (
                <>
                  <MyIcon type="icon-dian" style={{ color: '#1677ff' }} />
                  &nbsp;
                  <span>执行中</span>
                </>
              ) : text == '2' ? (
                <>
                  <MyIcon type="icon-dian" style={{ color: '#1e9392' }} />
                  &nbsp;
                  <span>已完成</span>
                </>
              ) : (
                '--'
              )}
            </div>
          </Tooltip>
        );
      },
    },
    {
      title: '联系人',
      dataIndex: 'ownerName',
      key: 'ownerName',
      sorter: (a: any, b: any) => getSorter(a?.ownerName, b?.ownerName),
      visible: true,
      width: 150,
      render: (text: string) => ColumnsRenderFun({ text }),
    },
    {
      title: '联系电话',
      dataIndex: 'ownPhone',
      key: 'ownPhone',
      sorter: (a: any, b: any) => getSorter(a?.ownPhone, b?.ownPhone),
      visible: true,
      width: 150,
      render: (text: string) => ColumnsRenderFun({ text }),
    },
    {
      title: '创建时间',
      dataIndex: 'createTime',
      key: 'createTime',
      width: 220,
      visible: true,
      sorter: (a: any, b: any) => getSorter(a?.createTime, b?.createTime),
      render: (text: string) => <span>{removeDateHmsStr(text)}</span>,
    },
    {
      title: '创建人公司',
      dataIndex: 'createCompanyName',
      key: 'createCompanyName',
      width: 180,
      visible: false,
      sorter: (a: any, b: any) => getSorter(a?.createCompanyID, b?.createCompanyID),
      render: (text: string) => ColumnsRenderFun({ text }),
    },
    {
      title: '创建人部门',
      dataIndex: 'createDepartmentName',
      key: 'createDepartmentName',
      width: 180,
      visible: false,
      sorter: (a: any, b: any) => getSorter(a?.createDepartmentID, b?.createDepartmentID),
      render: (text: string) => ColumnsRenderFun({ text }),
    },
    {
      title: '创建人岗位',
      dataIndex: 'createPositionName',
      key: 'createPositionName',
      width: 180,
      visible: false,
      sorter: (a: any, b: any) => getSorter(a?.createPositionID, b?.createPositionID),
      render: (text: string) => ColumnsRenderFun({ text }),
    },
    {
      title: '创建人',
      dataIndex: 'createrName',
      key: 'createrName',
      width: 120,
      visible: false,
      sorter: (a: any, b: any) => getSorter(a?.createrID, b?.createrID),
      render: (text: string) => ColumnsRenderFun({ text }),
    },
  ];
};
